<template>
  <div>
     <input type="text" v-model="msg">
     <textarea v-model="msg1" name="" id="" cols="30" rows="10"></textarea>
     <select name="" id="" v-model="val">
      <option>北京</option>
      <option>上海</option>
      <option>天津</option>
     </select>
     <hr>
     <input type="text" v-model.number="n1">
     <input type="text" v-model.number="n2">
     <button @click="add">+</button>
     <hr>
     <input type="text" v-model.trim="msg1">
     <hr>
     <input type="text" v-model.lazy="msg1">
   </div>
</template>
 
<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      msg:"你好",
      msg1:"hello",
      val:"北京",
      n1:9,
      n2:7
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    add(){
      console.log(this.n1+this.n2)
    }
  }
};
</script>

<style scoped>
     
</style>
